import { lazy } from 'react';
import { RouteObject } from 'react-router-dom';
import { Navigate } from 'react-router-dom';
import AuthWrapper from '@/components/AuthWrapper';
import RxLazy from '@/components/RxLazy';

const AccountPage = lazy(() => import('@/pages/Profile/components/Account'));
const AddressPage = lazy(() => import('@/pages/Profile/components/Address'));
const ChangePwd = lazy(() => import('@/pages/Profile/components/ChangePwd'));
const Collects = lazy(() => import('@/pages/Profile/components/Collects'));
const CommentPage = lazy(() => import('@/pages/Profile/components/Comment'));
const Fans = lazy(() => import('@/pages/Profile/components/Fans'));
const Follow = lazy(() => import('@/pages/Profile/components/Follow'));
const MyDynamic = lazy(() => import('@/pages/Profile/components/MyDynamic'));
const MyOrders = lazy(() => import('@/pages/Profile/components/MyOrders'));
const ReceivedOrders = lazy(
  () => import('@/pages/Profile/components/ReceivedOrders')
);
const ReplyPage = lazy(() => import('@/pages/Profile/components/Reply'));
const UserinfoPage = lazy(() => import('@/pages/Profile/components/Userinfo'));
const Profile = lazy(() => import('@/pages/Profile'));
const SellPage = lazy(() => import('@/pages/Profile/components/MySell'));

export default [
  {
    path: '/profile',
    element: (
      <RxLazy>
        <AuthWrapper>
          <Profile />
        </AuthWrapper>
      </RxLazy>
    ),
    children: [
      {
        path: '',
        element: <Navigate to={'/profile/userinfo'} replace />,
      },
      {
        path: 'userinfo',
        element: (
          <RxLazy>
            <UserinfoPage />
          </RxLazy>
        ),
      },
      {
        element: (
          <RxLazy>
            <ChangePwd />
          </RxLazy>
        ),
        path: 'change_pwd',
      },
      {
        element: (
          <RxLazy>
            <AddressPage />
          </RxLazy>
        ),
        path: 'address',
      },
      {
        element: (
          <RxLazy>
            <SellPage />
          </RxLazy>
        ),
        path: 'sell',
      },
      {
        element: (
          <RxLazy>
            <ReceivedOrders />
          </RxLazy>
        ),
        path: 'received_orders',
      },
      {
        element: (
          <RxLazy>
            <AccountPage />
          </RxLazy>
        ),
        path: 'account',
      },
      {
        element: (
          <RxLazy>
            <ReplyPage />
          </RxLazy>
        ),
        path: 'reply',
      },
      {
        element: (
          <RxLazy>
            <MyOrders />
          </RxLazy>
        ),
        path: 'my_orders',
      },
      {
        element: (
          <RxLazy>
            <CommentPage />
          </RxLazy>
        ),
        path: 'comment',
      },
      {
        element: (
          <RxLazy>
            <Follow />
          </RxLazy>
        ),
        path: 'follow',
      },
      {
        element: (
          <RxLazy>
            <Collects />
          </RxLazy>
        ),
        path: 'collects',
      },
      {
        element: (
          <RxLazy>
            <Fans />
          </RxLazy>
        ),
        path: 'fans',
      },
      {
        element: (
          <RxLazy>
            <MyDynamic />
          </RxLazy>
        ),
        path: 'my_dynamic',
      },
    ],
  },
] as RouteObject[];
